// https://highlightjs.readthedocs.io/en/latest/theme-guide.html

$background: var(--hl-base);
$keyword: var(--hl-hue-3);
$string: var(--hl-hue-4);
$plain: var(--hl-mono-1);
$comments: var(--hl-mono-3);
$variable: var(--hl-mono-1);
$functions: var(--hl-hue-2);
$codeFontFamily: Consolas, Lucida Console, Monaco, Andale Mono, Ubuntu Mono,
    monospace;

// tinymce5
// Markdown
#cnblogs_post_body.blogpost-body-html,
#mainContent .cnblogs-markdown {
    pre {
        position: relative;
        margin-top: 8px;
        padding: 24px 0 10px;
        border-radius: 4px;
        background: $background;
        font-family: $codeFontFamily !important;
        // overflow: inherit;
        &::before {
            content: '';
            display: block;
            height: 23px;
            width: 64px;
            background: url(https://guangzan.gitee.io/imagehost/awescnb/images/bg/mac.png)
                no-repeat;
            background-size: 65px 23px;
            position: absolute;
            top: 8px;
            left: 10px;
        }
    }
    // 单行代码及代码块
    code {
        font-family: $codeFontFamily !important;
        font-size: 15px !important;
        margin: 0;
        word-break: break-word !important;
        border: none !important;
    }
    // 代码块
    li code {
        font-weight: 700;
    }
    .hljs {
        display: block !important;
        color: var(--hl-mono-1) !important;
        background: $background !important;
        border: none !important;
        padding: 16px 10px 8px 26px !important;
        font-weight: normal;
    }
    .hljs-comment,
    .hljs-quote {
        color: var(--hl-mono-3);
        font-style: italic;
    }
    .hljs-tag {
        color: var(--hl-tag);
    }
    .hljs-doctag,
    .hljs-formula,
    .hljs-keyword {
        color: $keyword;
    }
    .hljs-deletion,
    .hljs-name,
    .hljs-section,
    .hljs-selector-tag,
    .hljs-subst {
        color: var(--hl-hue-5);
    }
    .hljs-literal {
        color: var(--hl-hue-1);
    }
    .hljs-addition,
    .hljs-attribute,
    .hljs-meta-string,
    .hljs-regexp,
    .hljs-string {
        color: var(--hl-hue-4);
    }
    .hljs-built_in,
    .hljs-class .hljs-title {
        color: var(--hl-hue-6-2);
    }
    .hljs-attr,
    .hljs-number,
    .hljs-selector-attr,
    .hljs-selector-class,
    .hljs-selector-pseudo,
    .hljs-template-variable,
    .hljs-type,
    .hljs-variable {
        color: var(--hl-hue-6);
    }
    .hljs-bullet,
    .hljs-link,
    .hljs-meta,
    .hljs-selector-id,
    .hljs-symbol,
    .hljs-title {
        color: var(--hl-hue-2);
    }
    .hljs-emphasis {
        font-style: italic;
    }
    .hljs-strong {
        font-weight: 700;
    }
    .hljs-link {
        text-decoration: underline;
    }
}

// tinymce
#cnblogs_post_body {
    .cnblogs_code {
        border: none;
        background-color: $background;
        border-radius: 4px;
        pre {
            padding: 30px 12px 12px;
            overflow: auto;
            &::before {
                display: none;
            }
        }
        & > img {
            display: none;
        }
        span {
            background-color: $background !important;
            &[style='color: #008000;'] {
                color: var(--hl-mono-3) !important;
                font-style: italic;
            }
            &[style='color: rgba(0, 128, 128, 1);'] {
                color: red !important;
            }
            &[style='background-color: #f5f5f5; color: #000000;'],
            &[style='color: #000000;'] {
                color: var(--hl-mono-1) !important;
            }
            &[style='background-color: #f5f5f5; color: #800000;'] {
                color: var(--hl-hue-2) !important;
            }
            &[style='color: #0000ff;'],
            &[style='background-color: #f5f5f5; color: #0000ff;'] {
                color: $keyword !important;
            }
            &[style='color: #800000;'],
            &[style='color: #ff0000;'],
            &[style='background-color: #f5f5f5; color: #ff0000;'] {
                color: var(--hl-hue-4) !important;
            }
            &[style='color: #8b0000;'] {
                color: var(--hl-hue-6) !important;
            }
        }
    }
    .cnblogs_code_collapse,
    .cnblogs_code_toolbar,
    .code_img_opened,
    .code_img_closed {
        display: none;
    }
    .cnblogs_code_hide {
        display: block;
    }
}

.syntaxhighlighter {
    background: $background !important;
    .line.alt1,
    .line.alt2 {
        background-color: $background !important;
    }
}

#cnblogs_post_body {
    .cnblogs_Highlighter {
        table {
            tbody {
                width: 100% !important;
            }
            .gutter {
                padding-bottom: 0 !important;
            }
        }

        code {
            background-color: $background !important;
        }
        .keyword {
            color: $keyword !important;
        }
        .string {
            color: $string !important;
        }
        .plain {
            color: $plain !important;
        }
        .variable {
            color: $variable !important;
        }
        .comments {
            color: $comments !important;
            font-style: italic !important;
        }
        .functions {
            color: $functions !important;
        }
    }
}
